<div class="row">
  <div class="col-xs-12">
    <div class="box">
      <div class="box-body">
        <form class="form-inline">
          <div class="box box-default">
            <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12" style="padding-left:0px;margin-bottom:8px !important;">
              <button type="button" *ngIf="_.includes(menuResourceSet,'btn-productInfo-cost-export')" class="btn btn-primary" (click)="exportExcel()">
                      <i class="fa fa-sign-out"></i>导出Excel</button>
              <button type="button" class="btn btn-box-tool pull-right" data-widget="collapse">
                          <i class="fa fa-minus"></i></button>
            </div>
            <div class="box-body" style="display:block">
              <div class="form-group col-lg-12" style="margin-bottom:10px !important;padding-left:0px !important;">
                <label>产品代码：</label>
                <input class="form-control" [(ngModel)]="getBody.sFundCode" name="sFundCode" placeholder="产品代码">
                <!-- updated by dujh @20180703 start -->
                <!-- <label class="control-label">开始日期：</label>
                <div class="input-group date form_datetime">
                  <span class="input-group-addon">
                          <i class="fa fa-calendar"></i>
                        </span>
                  <input type="text" class="form-control" style="background: white; cursor: pointer;" mwlFlatpickr [ngModelOptions]="{standalone: false}"
                    [(ngModel)]="getBody.sBegin" name="sBegin">
                </div> -->
                <label>产品名称：</label>
                <input class="form-control" [(ngModel)]="getBody.sFundName" name="sFundName" placeholder="产品名称">
                <!-- updated by dujh @20180703 end -->
                <label>产品类型：</label>
                <select class="form-control" [(ngModel)]="getBody.sFundType" name="sFundType">
                      <option [value]="''">全部</option>
                      <option [value]="item.sItemKey" *ngFor="let item of dictionaryList.FUND_TYPE">{{item.sItemValue}}</option>
                    </select>
                <button type="button" class="btn btn-primary search-btn" (click)="list(1)">
                        <i class="fa fa-search"></i>查询</button>
              </div>
              <div class="form-group col-lg-12" style="padding-left:0px !important;">
                <!-- updated by dujh @20180703 start -->
                <!-- <label>产品名称：</label>
                <input class="form-control" [(ngModel)]="getBody.sFundName" name="sFundName" placeholder="产品名称"> -->
                <label class="control-label">开始日期：</label>
                <div class="input-group date form_datetime">
                  <span class="input-group-addon">
                    <i class="fa fa-calendar"></i>
                  </span>
                  <input type="text" class="form-control" style="background: white; cursor: pointer;" mwlFlatpickr [ngModelOptions]="{standalone: false}"
                    [(ngModel)]="getBody.sBegin" name="sBegin">
                </div>
                <!-- updated by dujh @20180703 end -->
                <label class="control-label">结束日期：</label>
                <div class="input-group date form_datetime">
                  <span class="input-group-addon">
                          <i class="fa fa-calendar"></i>
                        </span>
                  <input type="text" class="form-control" style="background: white; cursor: pointer;" mwlFlatpickr [ngModelOptions]="{standalone: false}"
                    [(ngModel)]="getBody.sEnd" name="sEnd">
                </div>
                <label>费用类型：</label>
                <select class="form-control" [(ngModel)]="getBody.sFeeType" name="sFeeType">
                      <option [value]="''">全部</option>
                      <option [value]="item.sItemKey" *ngFor="let item of dictionaryList.S_FEE_TYPE">{{item.sItemValue}}</option>
                    </select>
              </div>
            </div>
          </div>
        </form>

        <div class="box-body" style="padding-left:0px;padding-right:0px;">
          <div style="overflow-x:scroll;width:100%">
            <table id="fixed-table" class="table table-bordered table-hover table-keep-line table-striped">
              <thead>
                <tr>
                  <th class="width-5">
                    <div class="checkbox checkbox-primary">
                      <input type="checkbox" name="checkboxAll" [(ngModel)]="isCheckedAll" (ngModelChange)="checkedAll()">
                      <label></label>
                    </div>
                  </th>
                  <th class="width-15" (click)="orderData('fCode')">产品代码<i class="fa fa-sort"></i></th>
                  <th class="width-20" (click)="orderData('sFundName')">产品简称<i class="fa fa-sort"></i></th>
                  <th class="width-15" (click)="orderData('sFundTypeZh')">产品类型<i class="fa fa-sort"></i></th>
                  <th class="width-15" (click)="orderData('tDate')">日期<i class="fa fa-sort"></i></th>
                  <th class="width-15" (click)="orderData('sFeeTypeZh')">费用类型<i class="fa fa-sort"></i></th>
                  <th class="width-15" (click)="orderData('nMoney')">金额<i class="fa fa-sort"></i></th>
                </tr>
              </thead>
              <tbody>
                <tr *ngFor="let item of dataList">
                  <td class="width-5">
                    <div class="checkbox checkbox-primary">
                      <input type="checkbox" name="checkbox1" [(ngModel)]="item.isChecked" (ngModelChange)="ctrlCheckAll()">
                      <label></label>
                    </div>
                  </td>
                  <td class="width-15 short_name" [attr.title]="item.fCode">{{item.fCode}}</td>
                  <td class="width-20 short_name" [attr.title]="item.sFundName">{{item.sFundName}}</td>
                  <td class="width-15 short_name" [attr.title]="item.sFundTypeZh">{{item.sFundTypeZh}}</td>
                  <td class="width-15 short_name" [attr.title]="item.tDate">{{item.tDate}}</td>
                  <td class="width-15 short_name" [attr.title]="item.sFeeTypeZh">{{item.sFeeTypeZh}}</td>
                  <td class="width-15 short_name" [attr.title]="item.nMoney">{{item.nMoney}}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>

        <div class="box-footer clearfix">
          <app-pagination [currentPageNum]="listPageInfo.currentPageNum" [pagesShow]="" [totalPages]="listPageInfo.totalPages" (pageChanged)="listPageNavigation($event)">
            <div class="pull-left pagination-detail" data-pagination-additional="true">
              <span class="pagination-info">
                      当前显示第{{listPageInfo.startRow}}到第{{listPageInfo.endRow}}条，总共{{listPageInfo.total}}条，
                  </span>
              <span class="page-list">每页记录
                    <span class="btn-group dropup">
                      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                        <span class="page-size">{{listPageInfo.pageSize}}</span><span class="caret"></span>
              </button>
              <ul class="dropdown-menu" role="menu">
                <li *ngFor="let i of listPageInfo.pageList" role="menuitem" [class.active]="listPageInfo.pageSize===i" (click)="listPageSizeChange(i)">
                  <a>{{i}}</a>
                </li>
              </ul>
              </span>条
              </span>
            </div>
          </app-pagination>
        </div>
      </div>
    </div>
  </div>
</div>